<template>
    <v-container class="full-height text-center align-center justify-center d-flex flex-column">
        <v-img :src="imgUrl" :lazy-src="imgUrl" width="300" height="300" contain aspect-ratio="1">
            <template v-slot:placeholder>
                <v-row
                    class="fill-height ma-0"
                    align="center"
                    justify="center"
                >
                    <v-progress-circular indeterminate color="grey lighten-5"></v-progress-circular>
                </v-row>
            </template>
        </v-img>
        <h3 class="accent--text">扫描二维码并且在官方小程序选择您需要打印的文件即可开始打印</h3>
    </v-container>
</template>

<script>
    import { mapGetters } from 'vuex'
    import { machineIdSync } from 'node-machine-id'
    import { encrypt, decrypt } from '@/utils/encryption.js'

    const QRCode = require('qrcode')
    export default {
        name: 'scan',
        data() {
            return {
                imgUrl: ''
            }
        },
        computed: {
            ...mapGetters([
                'token'
            ]),
            key() {
                return encrypt(machineIdSync())
            }
        },
        mounted() {
            QRCode.toDataURL(this.key, (err, url) => {
                this.imgUrl = url
            })
        }
    }
</script>

<style scoped>

</style>
